// 全局变量
$(function () {
    $("#jqGrid").jqGrid({
        url: baseURL + 'material/material/list',
        datatype: "json",
        colModel: [
            { label: 'materialId', name: 'materialId', index: 'material_id', width: 50, key: true },
            { label: '耗材编号', name: 'materialCode', index: 'material_code', width: 80 },
            { label: '耗材名称', name: 'materialName', index: 'material_name', width: 80 },
            { label: '分类名称', name: 'categoryName', width: 80 },
            { label: '发布状态', name: 'status', index: 'status', width: 80,align: 'center',
                formatter: function (value, options, row) {
                    var valueText = "";
                    var userData = $("#" + options.gid).jqGrid('getGridParam', 'userData');
                    $.each(userData.materialStatusEnum, function (index, module) {
                        if (module.id == value) {
                            valueText = module.describe;
                            return false;
                        }
                    });
                    return valueText;
                }
            },
            { label: '单位', name: 'unit', index: 'unit', width: 80, align: 'center',
                formatter: function (value, options, row) {
                    var valueText = "";
                    var userData = $("#" + options.gid).jqGrid('getGridParam', 'userData');
                    $.each(userData.materialUnitEnum, function (index, module) {
                        if (module.id == value) {
                            valueText = module.describe;
                            return false;
                        }
                    });
                    return valueText;
                }
            },
            { label: '型号', name: 'materialModel', index: 'material_model', width: 80 },
            { label: '规格', name: 'specifications', index: 'specifications', width: 80 },
            { label: '长(m)', name: 'length', index: 'length', width: 80 },
            { label: '宽(m)', name: 'width', index: 'width', width: 80 },
            { label: '克重(g)', name: 'weight', index: 'weight', width: 80 },
            { label: '更新人', name: 'updateName', index: 'update_name', width: 80 },
            { label: '更新时间', name: 'updateTime', index: 'update_time', width: 80 },
            { label: '创建人', name: 'createName', index: 'create_name', width: 80 },
            { label: '创建时间', name: 'createTime', index: 'create_time', width: 80 }
        ],
        viewrecords: true,
        height: 385,
        rowNum: 10,
        rowList : [10,30,50],
        rownumbers: true,
        rownumWidth: 25,
        autowidth:true,
        // multiselect: true,
        pager: "#jqGridPager",
        jsonReader: {
            root: "page.list",
            page: "page.currPage",
            total: "page.totalPage",
            records: "page.totalCount",
            userdata: "userData",
        },
        prmNames : {
            page:"page",
            rows:"limit",
            order: "order"
        },
        gridComplete:function(){
            //隐藏grid底部滚动条
            $("#jqGrid").closest(".ui-jqgrid-bdiv").css({ "overflow-x" : "hidden" });
        }
    });

});

//耗材分类树
var setting = {
    data: {
        simpleData: {
            enable: true,
            idKey: "categoryId",
            pIdKey: "parentId",
            rootPId: -1
        },
        key: {
            name: "categoryName",
            url:"nourl"
        },
    }
};
var ztree;
var vm = new Vue({
    el:'#rrapp',
    data:{
        showList: true,
        title: null,
        material:{
            categoryId:null,
            categoryName:null,
            unit:null,
            delete:false
        },
        // unitList:[{'name':'java', 'value':'java'},{'name':'c', 'value':'c'},{'name':'c++', 'value':'c++'}],
        unitList:[{'name':'个', 'value':'0'},{'name':'c', 'value':'c'},{'name':'c++', 'value':'c++'}],
        options: [
            { id: 0, text: '个' },
            { id: 1, text: '平方米(㎡)' },
            { id: 2, text: '重量(g)' },
            { id: 3, text: '长度(m)' },
            { id: 4, text: '张' }
        ]
    },
    methods: {
        query: function () {
            vm.reload();
        },
        add: function(){
            vm.showList = false;
            vm.title = "新增";
            // vm.material = {
            // 	// categoryId:null,categoryName:null
            // };
            // vm.materialCategory = {categoryName:null, categoryId:null};
            // vm.user = {deptName:null, deptId:null, status:1, roleIdList:[]};

            vm.getMaterialCategory();
        },
        update: function (event) {
            var materialId = getSelectedRow();
            if(materialId == null){
                return ;
            }
            vm.showList = false;
            vm.title = "修改";

            vm.getInfo(materialId)

            vm.getMaterialCategory();
        },
        saveOrUpdate: function (event) {
            var url = vm.material.materialId == null ? "material/material/save" : "material/material/update";
            $.ajax({
                type: "POST",
                url: baseURL + url,
                contentType: "application/json",
                data: JSON.stringify(vm.material),
                success: function(r){
                    if(r.code === 0){
                        alert('操作成功', function(index){
                            vm.reload();
                        });
                    }else{
                        alert(r.msg);
                    }
                }
            });
        },
        del: function (event) {
            var materialIds = getSelectedRows();
            if(materialIds == null){
                return ;
            }

            confirm('确定要删除选中的记录？', function(){
                $.ajax({
                    type: "POST",
                    url: baseURL + "material/material/delete",
                    contentType: "application/json",
                    data: JSON.stringify(materialIds),
                    success: function(r){
                        if(r.code == 0){
                            alert('操作成功', function(index){
                                $("#jqGrid").trigger("reloadGrid");
                            });
                        }else{
                            alert(r.msg);
                        }
                    }
                });
            });
        },
        getInfo: function(materialId){
            $.get(baseURL + "material/material/info/"+materialId, function(r){
                vm.material = r.material;
            });
        },
        reload: function (event) {
            vm.showList = true;
            var page = $("#jqGrid").jqGrid('getGridParam','page');
            $("#jqGrid").jqGrid('setGridParam',{
                page:page
            }).trigger("reloadGrid");
        },
        getMaterialCategory: function(){
            //加载菜单树
            $.get(baseURL + "material/materialcategory/select", function(r){
                ztree = $.fn.zTree.init($("#materialCategoryTree"), setting, r.materialCategoryList);
                var node = ztree.getNodeByParam("categoryId", vm.material.categoryId);
                if(node != null){
                    ztree.selectNode(node);
                    vm.material.categoryName = node.categoryName;
                }
            })
        },
        materialCategoryTree: function(){
            layer.open({
                type: 1,
                offset: '50px',
                skin: 'layui-layer-molv',
                title: "选择耗材分类",
                area: ['300px', '450px'],
                shade: 0,
                shadeClose: false,
                content: jQuery("#materialCategoryLayer"),
                btn: ['确定', '取消'],
                btn1: function (index) {
                    var node = ztree.getSelectedNodes();
                    //选择上级菜单
                    vm.material.categoryId = node[0].categoryId;
                    vm.material.categoryName = node[0].categoryName;

                    layer.close(index);
                }
            });
        },
    }
});


// 注册下拉选择框
Vue.component('ziyun-select', {
    props: ['options', 'value'],
    template: '<select><slot></slot></select>',
    mounted: function () {
        // var vm = this;// init select2
        $(this.$el).select2({ data: this.options }).val(this.value).trigger('change').on('change', function () {
            // emit event on change.
            // vm.$emit('input', this.value)
            vm.material.unit = this.value;
        })
    },
    watch: {
        value: function (value) {
            // update value
            $(this.$el).val(value).trigger('change')
        },
        options: function (options) {
            // update options
            $(this.$el).empty().select2({ data: options })
        }
    },
    destroyed: function () {
        $(this.$el).off().select2('destroy')
    }
})

